import Vue from "vue"
import VueRouter from "vue-router"
import discover from "@/pages/discover"
import friend from "@/pages/friend"
//将VueRouter注入到所有的Vue子组件

Vue.use(VueRouter)

//路由配置routes

//配置路由3个步骤

//1.创建页面组件

//2.配置rotes,一个数组,数组中每个对象基本属性path,component

//3.将router-view路由视图组件放到正确的位置

//路由懒加载(按需加载),主要通过import()这种语法,vue-cli是基于webpack,webpack编译的时候,遇到了import()这种语法,就会自动的将代码进行分割,split-code,实现懒加载的核心就是使用webpack的代码分割功能

//路由懒加载的好处:提高首屏的加载速度,提升用户体验,节省流量

//动态路由:就是通过切换路径,来达到传递参数的目的

let routes = [
    {
        path: "/discover",
        component: discover
    },
    {
        path: "/friend/:id",
        component: friend
    },
    {
        path: "/mine",
        component: () => import(/*webpackChunkName:'mine'*/"@/pages/mine")
    }
];

//实例化vue路由

let router = new VueRouter({
    routes
})

export default router